<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>猫眼电影</title>
    <link rel="stylesheet" href="../CSS/normalize.css">
    <link rel="stylesheet" href="./CSS/ranking.css">
</head>

<body>
<div class="header">
    <div class="container">
        <div class="logo">
            <img src="../img/logo_s.png" alt="">
        </div>
        <div class="position">
            <p>成都</p>
            <div class="trian">
            </div>
            <div class="city">
                <div class="at">
                    定位城市：成都
                </div>
                <div class="other">
                    A
                    <div>
                        <p>阿勒泰</p>
                        <p>安庆</p>
                        <p>安顺</p>
                        <p>阿克苏</p>
                        <p>安溪</p>
                    </div>
                    B
                    <div>
                        <p>北京</p>
                        <p>本溪</p>
                        <p>保定</p>
                        <p>巴彦淖尔</p>
                        <p>北海</p>
                    </div>
                    C
                    <div>
                        <p>重庆</p>
                        <p>长沙</p>
                        <p>常州</p>
                        <p>长春</p>
                        <p>承德</p>
                    </div>
                    D
                    <div>
                        <p>大连</p>
                        <p>东莞</p>
                        <p>大庆</p>
                        <p>德阳</p>
                        <p>达州</p>
                    </div>
                    E
                    <div>
                        <p>鄂尔多斯</p>
                        <p>恩施</p>
                        <p>峨眉山</p>
                    </div>
                    F
                    <div>
                        <p>福州</p>
                        <p>佛山</p>
                        <p>抚顺</p>
                        <p>防城港</p>
                    </div>
                    G
                    <div>
                        <p>广州</p>
                        <p>桂林</p>
                        <p>贵阳</p>
                        <p>广安</p>
                        <p>赣州</p>
                    </div>
                    H
                    <div>
                        <p>杭州</p>
                        <p>合肥</p>
                        <p>海口</p>
                        <p>哈尔滨</p>
                        <p>呼和浩特</p>
                    </div>
                    J
                    <div>
                        <p>锦州</p>
                        <p>济南</p>
                        <p>焦作</p>
                        <p>九江</p>
                        <p>嘉兴</p>
                    </div>
                    K
                    <div>
                        <p>昆明</p>
                        <p>开封</p>
                        <p>昆山</p>
                        <p>喀什</p>
                        <p>克拉玛依</p>
                    </div>
                    L
                    <div>
                        <p>廊坊</p>
                        <p>临汾</p>
                        <p>连云港</p>
                        <p>洛阳</p>
                        <p>乐山</p>
                    </div>
                    M
                    <div>
                        <p>牡丹江</p>
                        <p>马鞍山</p>
                        <p>茂名</p>
                        <p>梅州</p>
                        <p>绵阳</p>
                    </div>
                    N
                    <div>
                        <p>宁波</p>
                        <p>南京</p>
                        <p>南昌</p>
                        <p>南通</p>
                        <p>南宁</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="nav">
            <ul>
                <li><a href="./maoyanmovie">首页</a></li>
                <li><a href="./movie">电影</a></li>
                <li><a href="./ranking">榜单</a></li>
                <li><a href="./interview">热点</a></li>
                <li><a href="./interorders">订单</a></li>
            </ul>
        </div>

        <div class="search">
            <form action="getMovieByName">
                <input type="search" placeholder="找影视剧、影人、影院"

                       id="movie_name" name="movie_name">
                <input type="submit" value="">
            </form>
        </div>
        <div class="user">
            <img th:src="${session.user_photo}==null?'/../img/7dd82a16316ab32c8359debdb04396ef2897.png':${session.user_photo}">
            <div class="trian">
            </div>
            <div class="login">
                <a href="./login" th:text="${session.user_name}==null?'登录':${session.user_name}"></a>
            </div>
        </div>
    </div>
</div>

<div class="empty">
</div>

<div class="nav">
    <div class="nav-con">
        <div class="nav-box">
            <ul>
                <li><a href="ranking">热映口碑榜</a></li>
                <li><a href="./mostexpectedranking">最受期待榜</a></li>
                <li><a href="./boxofficeranking">国内票房榜</a></li>
                <li>北美票房榜</li>
                <li>TOP100榜</li>
            </ul>
        </div>
    </div>
</div>

<div class="rule">
    <div class="rule-con">
        <p>2016-10-21 <span>已更新</span></p>
        <p>榜单规则:将昨日国内热映的影片，按昭评分从高到低排列取前10名，每天上午10点更新。相关数据来源于“猫眼专业版”及“猫眼电影库”。</p>
    </div>

</div>

<div class="ranking-list">
    <div class="ranking-list-con">
            <div class="ranking-box ">
                <div class="num ">
                    <img src="../IMG/icon_04.png" alt="">
                </div>
                <div class="image ">
                    <img src="../IMG/movie_list_10.png " alt=" ">
                </div>
                <div class="info ">
                    <div class="info-con ">
                        <div class="info-main ">
                            <p class="name ">圆梦巨人</p>
                            <p>主演：马克·里朗斯,鲁比·巴恩希尔,黄磊</p>
                            <p class="time ">上映时间：2016-10-14</p>
                        </div>
                        <div class="score ">
                            <i>8.4</i>
                        </div>
                    </div>
                </div>
            </div>
 

        <div class="ranking-box ">
            <div class="num ">
                <img src="../IMG/榜单_04_03.png" alt="">
            </div>
            <div class="image ">
                <img src="../IMG/movie_list_9.png " alt=" ">
            </div>
            <div class="info ">
                <div class="info-con ">
                    <div class="info-main ">
                        <p class="name ">七月与安生</p>
                        <p>主演：周冬雨,马思纯,李程彬</p>
                        <p class="time ">上映时间：2016-09-14</p>
                    </div>
                    <div class="score ">
                        <i>8.7</i>
                    </div>

                </div>
            </div>
        </div>


        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单3_03.jpg" alt="">
            </div>
            <div class="image ">
                <img src="../IMG/movie_list_8.png " alt=" ">
            </div>
            <div class="info ">
                <div class="info-con ">
                    <div class="info-main ">
                        <p class="name ">地球四季</p>
                        <p>主演：黄晓明,蒋雯丽</p>
                        <p class="time ">上映时间：2016-09-27</p>
                    </div>
                    <div class="score ">
                        <i>8.7</i>
                    </div>

                </div>
            </div>
        </div>

        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单_06.png" alt="">
            </div>
            <div class="image">
                <img src="../IMG/movie_list_7.png" alt="">
            </div>
            <div class="info">
                <div class="info-con">
                    <div class="info-main">
                        <p class="name">鲁滨逊漂流记</p>
                        <p>主演：伊尔卡·贝辛,迪埃特尔·哈乐沃登,马提亚斯·施维赫夫</p>
                        <p class="time">上映时间：2016-10-04</p>
                    </div>
                    <div class="score">
                        <i>8.7</i>
                    </div>

                </div>
            </div>
        </div>

        <!--6 -->
        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单_07.png" alt="">
            </div>
            <div class="image">
                <img src="../IMG/movie_list_5.png" alt="">
            </div>
            <div class="info">
                <div class="info-con">
                    <div class="info-main">
                        <p class="name">勇士</p>
                        <p>主演：李东学,聂远,于小伟</p>
                        <p class="time">上映时间：2016-10-14</p>
                    </div>
                    <div class="score">
                        <i>8.8</i>
                    </div>

                </div>
            </div>
        </div>


        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单6_03.jpg" alt="">
            </div>
            <div class="image">
                <img src="../IMG/movie_list_6.png" alt="">
            </div>
            <div class="info">
                <div class="info-con">
                    <div class="info-main">
                        <p class="name">从你的全世界路过</p>
                        <p>主演：邓超,白百何,杨洋</p>
                        <p class="time">上映时间：2016-09-29</p>
                    </div>
                    <div class="score">
                        <i>8.7</i>
                    </div>

                </div>
            </div>
        </div>


        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单7_03.jpg" alt="">
            </div>
            <div class="image">
                <img src="../IMG/movie_list_4.png" alt="">
            </div>
            <div class="info">
                <div class="info-con">
                    <div class="info-main">
                        <p class="name">机械师2：复活</p>
                        <p>主演：杰森·斯坦森,杰西卡·阿尔芭,汤米·李·琼斯</p>
                        <p class="time">上映时间：2016-10-21</p>
                    </div>
                    <div class="score">
                        <i>8.9</i>
                    </div>

                </div>
            </div>
        </div>

        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单8_03.jpg " alt=" ">
            </div>
            <div class="image">
                <img src="../IMG/movie_list_2.png" alt="">
            </div>
            <div class="info">
                <div class="info-con">
                    <div class="info-main">
                        <p class="name">逗鸟外传：萌宝满天飞</p>
                        <p>主演∶安迪·萨姆伯格,凯蒂·克朗,凯尔希·格兰莫</p>
                        <p class="time">上映时间：2016-09-23</p>
                    </div>
                    <div class="score">
                        <i>9.0</i>
                    </div>

                </div>
            </div>
        </div>



        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单9_03.jpg " alt=" ">
            </div>
            <div class="image">
                <img src="../IMG/movie_list_3.png" alt="">
            </div>
            <div class="info">
                <div class="info-con">
                    <div class="info-main">
                        <p class="name">爱神箭</p>
                        <p>主演：应昊茗,赵圆瑗,姜潮</p>
                        <p class="time">上映时间：2016-10-14</p>
                    </div>
                    <div class="score">
                        <i>9.0</i>
                    </div>

                </div>
            </div>
        </div>

        <div class="ranking-box">
            <div class="num">
                <img src="../IMG/榜单10_03.jpg " alt=" ">
            </div>
            <div class="image">
                <a th:href="@{./getById(mid=1)}">
                    <img src="../IMG/movie_list_1.png" alt=""></a>
            </div>
            <div class="info">
                <div class="info-con">
                    <div class="info-main">
                        <p class="name">湄公河行动</p>
                        <p>主演：张涵予,彭于晏,冯文娟</p>
                        <p class="time">上映时间：2016-09-30</p>
                    </div>
                    <div class="score">
                        <i>9.3</i>
                    </div>

                </div>
            </div>
        </div>

                </div>
            </div>
        </div>
    </div>
</div>

<div class="footer">
    <div class="container">
        <p>&copy;2016猫眼电影 maoyan.com 京ICP证160733号 京ICP备16022489号-1 京公网安备 11010502030881号 网络文化经营许可证电子公告服务规则</p>
        <p>北京猫眼文化传媒有限公司</p>
    </div>

</div>

<div class="cat">
    <a href="#"><img src="../IMG/details_cat.png" alt=""></a>
</div>

</body>

</html>